<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <!-- 兼容性设置 -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- 上述3个meta标签*必须*放在最前面 -->
  <title>Bootstrap基本模版</title>

  <!-- Bootstrap -->
  <link href="./boots/css/bootstrap.min.css" rel="stylesheet">
  <link rel="stylesheet" href="./boots/css/bootstrap-theme.min.css">
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
    <script src="./boots/js/html5shiv.min.js"></script>
    <script src="./boots/js/respond.min.js"></script>
  <![endif]-->
  <link rel="stylesheet" href="./boots/css/my.css">
</head>

<body>
  <div class="container">
    <h2>表格<span class="label label-danger label-xs">HOT</span></h2>
    <div class="row">
    <div class="table-responsive">
      <table class="table table-striped table-bordered table-hover">
        <tr class="info">
          <th class="col-md-1">ID</th>
          <th class="col-md-2">姓名</th>
          <th class="col-md-1">性别</th>
          <th class="col-md-4">电话</th>
          <th class="col-md-2">三围</th>
          <th class="col-md-2">操作</th>
        </tr>
        <tr class="success">
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <td rowspan="10">6</td>
        </tr>
        <tr>
          <td class="danger">1</td>
          <td class="danger">2</td>
          <td class="danger">3</td>
          <td class="danger">4</td>
          <td class="danger">5</td>
          <!-- <td>6</td> -->
        </tr>
        <tr>
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <!-- <td>6</td> -->
        </tr>
        <tr>
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <!-- <td>6</td> -->
        </tr>
        <tr>
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <!-- <td>6</td> -->
        </tr>
        <tr>
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <!-- <td>6</td> -->
        </tr>
        <tr>
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <!-- <td>6</td> -->
        </tr>
        <tr>
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <!-- <td>6</td> -->
        </tr>
        <tr>
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <!-- <td>6</td> -->
        </tr>
        <tr>
          <td>1</td>
          <td>2</td>
          <td>3</td>
          <td>4</td>
          <td>5</td>
          <!-- <td>6</td> -->
        </tr>
      </table>
    </div>
    </div><!-- END ROW -->
  </div> <!-- END container -->
  <hr>
  <hr>
  <hr>
  <hr>
  <div class="container">
    <div class="row">
      <form class="col-md-6 col-md-offset-3 form-horizontal">

        <div class="form-group">
          <label for="exampleInputEmail1" class="col-md-2">用户名:</label>
          <div class="col-md-10">
            <input type="text" class="form-control input-sm" id="exampleInputEmail1" placeholder="请输入用户名!">
          </div>
        </div>

        <div class="form-group">
          <label for="Password1">密码:</label>
          <input type="password" class="form-control" id="Password1" placeholder="Password">
        </div>

        <div class="form-group">
          <label for="Password2">再次输入密码:</label>
          <input type="password" class="form-control" id="Password2" placeholder="Password">
        </div>
        
        <div class="checkbox">
          <label>
            <input type="checkbox"> 记住用户名(然并卵)
          </label>
        </div>
        

        <button type="submit" class="btn btn-primary btn-lg btn-block">我要登录</button>
      </form>
    </div><!-- END row -->
    <div class="clearfix"></div>
    <hr>
    <hr>
    <hr>
    <hr>
    <div class="row">
      <a class="btn btn-info" href="#" role="button">Link</a>
      <button class="btn btn-danger" type="submit">Button</button>
      <input class="btn btn-success" type="button" value="Input">
      <input class="btn btn-warning" type="submit" value="Submit">
    </div>
    <hr>
    <hr>
    <hr>
    <hr>
    <img src="holder.js/400x400" class="img-responsive img-circle" >
    <img src="./imgs/1.jpg" class="img-responsive img-circle" >
    <hr>
    <img src="holder.js/300x100" class="img-responsive" >
    <div class="row">
      <p class="bg-primary">删除的代码是没有bug的代码。</p>
      <p class="bg-danger">哒哒花店提醒您,毕业时请根据自身条件为老师献花:玫瑰花、荷花、校花、姐妹花.....</p>
      <p class="bg-info">软件和教堂非常相似——建成之后我们就在祈祷。(Sam Redwine)</p>
      <p class="bg-warning">软件通常有beta版本。Beta在拉丁语中是“还不能用”的意思。</p>
    </div>
  </div><!-- end container -->


  <!-- 必须引入 jQuery -->
  <script src="./boots/js/jquery.min.js"></script>
  <!-- 此条必须写在JQ的后面引入-->
  <script src="./boots/js/bootstrap.min.js"></script>
  <script src="./boots/js/holder.js"></script>
</body>
</html>